.blogStoryCase div,.blogStoryCase p,.blogStoryCase span{
    position: relative;
}
.blogStoryCase .posa{width: 100%;height: 100%;position: absolute;left: 0;top: 0;}
.blogStoryCase .fill{width: 100%;height: 100%;}
.hide{display: none;}

.blogStoryCase .web_banner {display: block;}
.blogStoryCase .mobile_banner {display: none;}
.blogStoryCase .bannerBox{width: 100%;}
.blogStoryCase .store_img img{width: 100%;}
.blogStoryCase .line1{
    overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}
.blogStoryCase .line4{
    overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
}
.blogStoryBtn{
    width: 101px;
    height: 65px;
    /* background: linear-gradient(-30deg, #d1b365, #c79b58); */
    background-image: url(/best/img/blogStory/pc/r_bg.png);
    background-size: cover;
    background-repeat: no-repeat;
    /* border-radius: 10px 0px 0px 10px; */
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    position: fixed;
    right: 0;
    top: 42%;
    cursor: pointer;
    z-index: 1000;
}
.blogStoryBtn img{
    width: 37px;
    height: 28px;
    margin-top: 6px;
}
.blogStoryBtn p{
    width: 100%;
    font-weight: bold;
    font-size: 16px;
    color: #FFFFFF;
    text-align: center;
}

.blogStoryCase div{box-sizing: border-box;}
.blogStoryCase{width: 100%;height: 100%;z-index: 9999;position: fixed;left: 0;top: 0;background: rgba(0, 0, 0, 0.7);}
.blogStoryCase .blogStoryCaseCont{width: 1297px;height: 833px;background-color: #fff;position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%);}
.blogStoryCase .blogStoryCaseCont .title{width: 1080px;margin: 44px auto 0;display: flex;align-items: center;font-weight: 800;font-size: 22px;color: #000000;}
.blogStoryCase .blogStoryCaseCont .title img{width: 168px;height: 21px;font-weight: 800;font-size: 22px;color: #000000;margin-right: 16px;}
.blogStoryCase .blogStoryCaseCont .closeCase{width: 50px;height: 50px;position: absolute;right: -25px;top: -20px;cursor: pointer;transition: 0.3s all;}
/* .blogStoryCase .blogStoryCaseCont .closeCase:hover{transform: rotate(180deg);} */
.blogStoryCase .blogStoryCaseCont .tabs{display: flex;padding: 40px 0 0 0;margin-left: 10px;}
.blogStoryCase .blogStoryCaseCont .tabs .tab{width: 147px;cursor: pointer;padding-bottom: 20px;margin: 0 0 -2px 0;}
.blogStoryCase .blogStoryCaseCont .tabs .tab::after{content: '';width: 0;height: 2px;background: #FFB400; position: absolute;left: 50%;bottom: 0;transform: translateX(-50%); transition: 0.3s all;}
.blogStoryCase .blogStoryCaseCont .tabs .tab:hover::after{width: 74px;}
.blogStoryCase .blogStoryCaseCont .tabs .tab:nth-child(n+2) p::after{content: '';width: 1px;height: 17px; position: absolute;left: 0;top: 50%;transform: translateY(-50%);background: #EAEAEA;}
.blogStoryCase .blogStoryCaseCont .tabs .tab img{width: 100%;height: 100%;}
.blogStoryCase .blogStoryCaseCont .tabs .tab p{width: 100%;font-size: 22px;color: #000000;transition: 0.3s all;text-align: center;}
.blogStoryCase .blogStoryCaseCont .tabs .tab.tabAct p{font-weight: 800;color: #CC9933;}
.blogStoryCase .blogStoryCaseCont .tabs .line{width:74px;height: 2px;background: #FFB400;position: absolute;left: 36.5px;bottom: -2px;transition: 0.3s all;}
.blogStoryCase .blogStoryCaseCont .caseList{width: 1205px;height: calc(100% - 238px);margin: 20px auto 0;display: flex;flex-wrap: wrap;}
.blogStoryCase .blogStoryCaseCont .caseList .caseItem{width: 220px;height: 285px;cursor: pointer;padding-top: 1px;position: relative;}
.blogStoryCase .blogStoryCaseCont .caseList .caseItem a{width: 100%;height: 100%;position: absolute;left: 0;top: 0;}
.blogStoryCase .blogStoryCaseCont .caseList .caseItem:nth-child(5n+2),.blogStoryCase .blogStoryCaseCont .caseList .caseItem:nth-child(5n+3),.blogStoryCase .blogStoryCaseCont .caseList .caseItem:nth-child(5n+4),.blogStoryCase .blogStoryCaseCont .caseList .caseItem:nth-child(5n+5){
    margin-left: 22px;
}
.blogStoryCase .blogStoryCaseCont .caseList .caseItem:nth-child(n+6){margin-top: 22px;}
.blogStoryCase .blogStoryCaseCont .caseList .caseItem .caseImg{width: 220px;height: 285px;overflow: hidden;border: 2px solid #fff;transition: 0.3s all;}
.blogStoryCase .blogStoryCaseCont .caseList .caseItem .caseImg img{object-fit: cover;}
.blogStoryCase .blogStoryCaseCont .caseList .caseItem .caseImg video{object-fit: cover;}
.blogStoryCase .blogStoryCaseCont .caseList .caseItem .caseImg .botmInfo{position: absolute;left: 0;bottom: 0;padding: 105px 18px 18px 18px;background: linear-gradient(to top, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0) 100%);}
.blogStoryCase .blogStoryCaseCont .caseList .caseItem .caseImg .botmInfo .userInfo{display: flex;align-items: center;}
.blogStoryCase .blogStoryCaseCont .caseList .caseItem .caseImg .botmInfo .userInfo .head{width: 32px;height: 32px;border-radius: 50%;overflow: hidden;border: 1px solid rgba(255,255,255,0);transition: 0.3s all;}
.blogStoryCase .blogStoryCaseCont .caseList .caseItem .caseImg .botmInfo .userInfo .name{width: 130px;font-weight: bold;font-size: 16px;color: #FFFFFF;margin-left: 6px;transition: 0.3s all;}
.blogStoryCase .blogStoryCaseCont .caseList .caseItem .caseImg .botmInfo .userInfo .arrow{width: 8px;height: 14px;margin-left: 4px;}
.blogStoryCase .blogStoryCaseCont .caseList .caseItem .caseImg .botmInfo .userInfo .arrow img:nth-child(2){opacity: 0;}
.blogStoryCase .blogStoryCaseCont .caseList .caseItem .caseImg .botmInfo .userInfo .arrow img{transition: 0.3s all;}
.blogStoryCase .blogStoryCaseCont .caseList .caseItem .caseImg .botmInfo .text{width: 100%;font-weight: 400;font-size: 14px;color: #FFFFFF;line-height: 22px;padding-top: 6px;transition: 0.3s all;}

.blogStoryCase .blogStoryCaseCont .caseList .caseItem:hover .caseImg{border: 2px solid #CC9933;}
.blogStoryCase .blogStoryCaseCont .caseList .caseItem:hover .caseImg .botmInfo .userInfo .head{border: 1px solid #CC9933;}
.blogStoryCase .blogStoryCaseCont .caseList .caseItem:hover .caseImg .botmInfo .userInfo .name{color: #CC9933;}
.blogStoryCase .blogStoryCaseCont .caseList .caseItem:hover .caseImg .botmInfo .userInfo .arrow img:nth-child(1){opacity: 0;}
.blogStoryCase .blogStoryCaseCont .caseList .caseItem:hover .caseImg .botmInfo .userInfo .arrow img:nth-child(2){opacity: 1;}
.blogStoryCase .blogStoryCaseCont .caseList .caseItem:hover .caseImg .botmInfo .text{color: #CC9933;}
.blogStoryCase #pagination{display: flex;justify-content: center;margin-top: 33px;}

.blogStoryCase #pagination.light-theme ul li a,.blogStoryCase #pagination.light-theme ul li span{transition: 0.3s all;}
.blogStoryCase #pagination.light-theme ul li a.page-link{width: 57px;height: 57px;background: #FFFFFF;border: 2px solid #DFDFDF;font-weight: bold;font-size: 18px;color: #000000;text-align: center;line-height: 53px;text-decoration: none;}
.blogStoryCase #pagination.light-theme ul li.active span.current{width: 57px;height: 57px;background: #CC9933;border: 2px solid #CC9933;font-weight: bold;font-size: 18px;color: #fff;text-align: center;line-height: 53px;}
.blogStoryCase #pagination.light-theme ul li span.ellipse.clickable{width: 57px;height: 57px;font-weight: bold;font-size: 30px;color: #000;text-align: center;line-height: 53px;text-decoration: none;}

.blogStoryCase #pagination.light-theme ul li a.page-link.prev,.blogStoryCase #pagination.light-theme ul li a.page-link.next{width: 133px;height: 57px;background: #FFFFFF;border: 2px solid #DFDFDF;font-weight: bold;font-size: 18px;color: #000000;text-align: center;line-height: 53px;text-decoration: none;}

.blogStoryCase #pagination.light-theme ul li.disabled span.prev,.blogStoryCase #pagination.light-theme ul li.disabled span.next{width: 133px;height: 57px;background: #FFFFFF;border: 2px solid #DFDFDF;opacity: 0.3;font-weight: bold;font-size: 18px;color: rgba(0, 0, 0, 6);text-align: center;line-height: 53px;text-decoration: none;}








@media (max-width:992px){
    /* phone */
    .blogStoryCase .web_banner {display: none;}
    .blogStoryCase .mobile_banner {display: block;}

    .blogStoryBtn{
        width: 1.01rem;
        height: 0.65rem;
        /* background: linear-gradient(to top, rgba(214,203,145,1), rgba(199,155,88,1)); */
        background-image: url(/best/img/blogStory/pc/r_bg.png);
        background-size: cover;
        background-repeat: no-repeat;
        /* border-radius: 0.1rem 0rem 0rem 0.1rem; */
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        position: fixed;
        right: 0;
        top: auto;
        bottom: calc(16% + 2.5rem);
        cursor: pointer;
        z-index: 1000;
    }
    .blogStoryBtn img{
        width: 0.37rem;
        height: 0.28rem;
        margin-top: 0.06rem;
    }
    .blogStoryBtn p{
        width: 100%;
        font-weight: bold;
        font-size: 0.16rem;
        color: #FFFFFF;
        text-align: center;
    }

    .blogStoryCase{width: 100%;height: 100%;z-index: 9999;position: fixed;left: 0;top: 0;background: rgba(0, 0, 0, 0.7);}
    .blogStoryCase .blogStoryCaseCont{width: 100%;height: 100%;background-color: #fff;position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%);padding-top: 0.71rem;}
    .blogStoryCase .blogStoryCaseCont .closeCase{width: 0.5rem;height: 0.5rem;position: absolute;right: 0.32rem;top: 1rem;cursor: pointer;transition: 0.3s all;z-index: 1;}
    /* .blogStoryCase .blogStoryCaseCont .closeCase:hover{transform: rotate(180deg);} */
    .blogStoryCase .blogStoryCaseCont .tabs{display: flex;padding: 0.38rem 0 0 0;margin-left: 0.1rem;}
    .blogStoryCase .blogStoryCaseCont .tabs .tab{width: 1.47rem;cursor: pointer;padding-bottom: 0.2rem;margin-bottom: -0.02rem;}
    .blogStoryCase .blogStoryCaseCont .tabs .tab::after{content: '';width: 0;height: 0.02rem;background: #FFB400; position: absolute;left: 50%;bottom: 0;transform: translateX(-50%); transition: 0.3s all;}
    .blogStoryCase .blogStoryCaseCont .tabs .tab:hover::after{width: 0.74rem;}
    .blogStoryCase .blogStoryCaseCont .tabs .tab:nth-child(n+2) p::after{content: '';width: 0.01rem;height: 0.17rem; position: absolute;left: 0;top: 50%;transform: translateY(-50%);background: #EAEAEA;}
    .blogStoryCase .blogStoryCaseCont .tabs .tab img{width: 100%;height: 100%;}
    .blogStoryCase .blogStoryCaseCont .tabs .tab p{width: 100%;font-size: 0.3rem;color: #000000;transition: 0.3s all;text-align: center;}
    .blogStoryCase .blogStoryCaseCont .tabs .tab.tabAct p{font-weight: 800;color: #CC9933;}
    .blogStoryCase .blogStoryCaseCont .tabs .line{width:0.74rem;height: 0.02rem;background: #FFB400;position: absolute;left: 0.365rem;bottom: -0.02rem;transition: 0.3s all;}
    .blogStoryCase .blogStoryCaseCont .caseList{width: 6.7rem;height: calc(100% - 2rem);overflow-y: auto;margin: 0.38rem auto 0;display: flex;flex-wrap: wrap;}
    .blogStoryCase .blogStoryCaseCont .caseList .caseItem{width: 3.17rem;height: 4.13rem;cursor: pointer;padding-top: 0.01rem;}
    .blogStoryCase .blogStoryCaseCont .caseList .caseItem:nth-child(5n+2),.blogStoryCase .blogStoryCaseCont .caseList .caseItem:nth-child(5n+3),.blogStoryCase .blogStoryCaseCont .caseList .caseItem:nth-child(5n+4),.blogStoryCase .blogStoryCaseCont .caseList .caseItem:nth-child(5n+5){
        margin-left: 0;
    }
    .blogStoryCase .blogStoryCaseCont .caseList .caseItem:nth-child(2n+2){
        margin-left:0.33rem;
    }
    .blogStoryCase .blogStoryCaseCont .caseList .caseItem:nth-child(n+3){margin-top: 0.3rem;}
    .blogStoryCase .blogStoryCaseCont .caseList .caseItem .caseImg{width: 100%;height: 100%;overflow: hidden;border: 0.02rem solid #fff;transition: 0.3s all;}
    .blogStoryCase .blogStoryCaseCont .caseList .caseItem .caseImg img{object-fit: cover;}
    .blogStoryCase .blogStoryCaseCont .caseList .caseItem .caseImg video{object-fit: cover;}
    .blogStoryCase .blogStoryCaseCont .caseList .caseItem .caseImg .botmInfo{position: absolute;left: 0;bottom: 0;padding: 1.62rem 0.27rem 0.22rem 0.27rem;background: linear-gradient(to top, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0) 100%);}
    .blogStoryCase .blogStoryCaseCont .caseList .caseItem .caseImg .botmInfo .userInfo{display: flex;align-items: center;}
    .blogStoryCase .blogStoryCaseCont .caseList .caseItem .caseImg .botmInfo .userInfo .head{width: 0.44rem;height: 0.44rem;border-radius: 50%;overflow: hidden;border: 0.01rem solid rgba(255,255,255,0);transition: 0.3s all;}
    .blogStoryCase .blogStoryCaseCont .caseList .caseItem .caseImg .botmInfo .userInfo .name{width: 1.8rem;font-weight: bold;font-size: 0.22rem;color: #FFFFFF;margin-left: 0.08rem;transition: 0.3s all;}
    .blogStoryCase .blogStoryCaseCont .caseList .caseItem .caseImg .botmInfo .userInfo .arrow{width: 0.11rem;height: 0.19rem;margin-left: 0.12rem;}
    .blogStoryCase .blogStoryCaseCont .caseList .caseItem .caseImg .botmInfo .userInfo .arrow img:nth-child(2){opacity: 0;}
    .blogStoryCase .blogStoryCaseCont .caseList .caseItem .caseImg .botmInfo .userInfo .arrow img{transition: 0.3s all;}
    .blogStoryCase .blogStoryCaseCont .caseList .caseItem .caseImg .botmInfo .text{width: 100%;font-weight: 400;font-size: 0.2rem;color: #FFFFFF;line-height: 0.3rem;padding-top: 0.14rem;transition: 0.3s all;}

    .blogStoryCase .blogStoryCaseCont .caseList .caseItem:hover .caseImg{border: 0.02rem solid #CC9933;}
    .blogStoryCase .blogStoryCaseCont .caseList .caseItem:hover .caseImg .botmInfo .userInfo .head{border: 0.01rem solid #CC9933;}
    .blogStoryCase .blogStoryCaseCont .caseList .caseItem:hover .caseImg .botmInfo .userInfo .name{color: #CC9933;}
    .blogStoryCase .blogStoryCaseCont .caseList .caseItem:hover .caseImg .botmInfo .userInfo .arrow img:nth-child(1){opacity: 0;}
    .blogStoryCase .blogStoryCaseCont .caseList .caseItem:hover .caseImg .botmInfo .userInfo .arrow img:nth-child(2){opacity: 1;}
    .blogStoryCase .blogStoryCaseCont .caseList .caseItem:hover .caseImg .botmInfo .text{color: #CC9933;}
    .blogStoryCase #pagination{display: none;}

    /* #pagination.light-theme ul li a,#pagination.light-theme ul li span{transition: 0.3s all;}
    #pagination.light-theme ul li a.page-link{width: 57px;height: 57px;background: #FFFFFF;border: 2px solid #DFDFDF;font-weight: bold;font-size: 18px;color: #000000;text-align: center;line-height: 53px;}
    #pagination.light-theme ul li.active span.current{width: 57px;height: 57px;background: #CC9933;border: 2px solid #CC9933;font-weight: bold;font-size: 18px;color: #fff;text-align: center;line-height: 53px;}
    #pagination.light-theme ul li span.ellipse.clickable{width: 57px;height: 57px;font-weight: bold;font-size: 30px;color: #000;text-align: center;line-height: 53px;}

    #pagination.light-theme ul li a.page-link.prev,#pagination.light-theme ul li a.page-link.next{width: 133px;height: 57px;background: #FFFFFF;border: 2px solid #DFDFDF;font-weight: bold;font-size: 18px;color: #000000;text-align: center;line-height: 53px;}

    #pagination.light-theme ul li.disabled span.prev,#pagination.light-theme ul li.disabled span.next{width: 133px;height: 57px;background: #FFFFFF;border: 2px solid #DFDFDF;opacity: 0.3;font-weight: bold;font-size: 18px;color: rgba(0, 0, 0, 6);text-align: center;line-height: 53px;} */
}